<template>
    <div class="app-container">
        <el-row>
          <el-col :span="24" style="margin-bottom: 8px;">
            <div style="font-weight: bold;color: #000;">系统页面</div>
          </el-col>
          <el-col :span="24">
            <div style="display: flex;flex-direction: row;">
              <div v-for="(item, index) in systemPage" :key="index" @click="functionAction(item)"
              :style="{'color': item.select? '#007aff': '#333', 'border': item.select?'1px solid #007aff':'1px solid #999'}"
              style="width: 80px;height: 35px;text-align: center;line-height: 35px;margin-right: 10px;cursor:pointer;">{{ item.title }}</div>
            </div>
          </el-col>

          <el-col :span="24" style="margin-top: 20px;margin-bottom: 8px;">
            <div style="font-weight: bold;color: #000;">自定义页面</div>
          </el-col>
          <el-col :span="24">
            <div style="display: flex;flex-direction: row;">
              <div v-for="(item, index) in customPage" :key="index" @click="functionAction(item)"
              :style="{'color': item.select? '#007aff': '#333', 'border': item.select?'1px solid #007aff':'1px solid #999'}"
              style="width: 80px;height: 35px;text-align: center;line-height: 35px;margin-right: 10px;cursor:pointer;">{{ item.title }}</div>
            </div>
          </el-col>
      </el-row>
    </div>
  </template>
  
  <script>
import { findPageConfigList } from '@/api/interface/pageConfig.js'
  export default {
    data() {
      return {
        systemPage: [
          {title: '创业中心', 'modal': 'push', 'pageeModel':{ name: 'businessCenter'}}, 
          {title: '商家中心', 'modal': 'push', 'pageeModel':{ name: 'takeout'}}, 
          {title: '会员商户', 'modal': 'push', 'pageeModel':{ name: 'shopList'}},
          {title: '活动列表', 'modal': 'push', 'pageeModel':{ name: 'activityList'}},
          {title: '礼包专区', 'modal': 'push', 'pageeModel':{ name: 'giftSection'}}
        ],
        customPage: [],
        currentFun: {},
        query: {}
      }
    },
    created() {
      this.findPageConfigList()
    },
    methods: {
      // 功能点击事件
      functionAction(item){
        this.$set(this.currentFun, 'select', false)
        this.$set(item, 'select', true)
        this.currentFun = item
        
        // 设置参数
        this.query.routeName = item.pageeModel.name
        if(this.query.routeName == 'custom'){
          this.query.modal = 'push'
          this.query.pageConfigId = item.id
        }else{
          this.query.modal = item.modal
        }
      },
      findPageConfigList() {
        findPageConfigList({
          pagee__name: 'custom'
        }).then(res => {
          if (res.data.code == 10000) {
            this.customPage = res.data.data.list
          }
        });
      },
    },
  }
  </script>
  <style scoped lang='scss'></style>
  